<template>
  <div>
    <FormPanel ref="from" :list="formList" @formChange="changeHandle" :isSubmitBtn="false" :collapse="false" :labelWidth="190"></FormPanel>
    <FilterTable ref="table" :columns="columns" :dataSource="tableList" height="auto" :isMemoryPagination="true" :isSelectColumn="false" :onColumnsChange="columns => (this.columns = columns)">
    </FilterTable>

    <BreakSpace label='操作记录' />
    <FilterTable
      ref="table"
      :columns="columns1"
      :dataSource="tableList1"
      :isSelectColumn="false"
      :isMemoryPagination="true"
      height='auto'
      :onColumnsChange="columns => this.columns1 = columns"
    >
    </FilterTable>
    <div style="height:47px;"></div>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <el-button @click="closeDrawer()">关 闭</el-button>
    </div>
  </div>
</template>
<script>
import { getAmount, getDiscount, getDealerAccountType, saveOrder, getDetail, getLog, getDealerAddress } from '@/api/dealerSale/OrderManagement/OrderSubmissionSideB/index.js';
import { dictionary } from '@/utils/dictMixin';
import Cookies from 'js-cookie';
import selectCar from './selectCar';
import moment from 'moment';
export default {
  props: ['rowData'],
  data() {
    this.saveData = null;
    return {
      formList: this.createdFrom(),
      columns: this.createdTable(),
      columns1: this.createdTable1(),
      tableList: [],
      tableList1: [],
      dealerAddress: [],
      dealerAddressItemList: [],
      accountTypeList: [],
      isaddCar: false,
      dealerData: {}
    };
  },
  components: {
    selectCar
  },
 async created() {
    this.getDealerAddress();
    this.getAmount();
    await this.getDealerAccountType();
    await this.init();
  },
  mounted() {
    this.table = this.$refs.table.$refs.pageTable;
  },
  mixins: [dictionary],
  methods: {
    createdFrom() {
      return [
        {
          type: 'BREAK_SPACE',
          label: '订单信息'
        },

        {
          type: 'INPUT',
          label: '订货单编号',
          fieldName: 'orderNo',
          disabled: true
        },
        {
          type: 'DATE',
          label: '订单年月',
          fieldName: 'orderYearAndMonth',
          disabled: true,
          dateType: 'month'
        },
        {
          type: 'INPUT',
          label: '经销商名称',
          fieldName: 'dealerName',
          disabled: true
        },
        {
          type: 'SELECT',
          label: '订单类型',
          fieldName: 'orderType',
          disabled: true,
          itemList: this.createDictList('2105')
        },
        {
          type: 'SELECT',
          label: '订单状态',
          fieldName: 'orderStatus',
          disabled: true,
          itemList: this.createDictList('2417')
         },
         {
          type: 'SELECT',
          label: '订单紧急度',
          fieldName: 'emergencyType',
          placeholder: '请选择',
          disabled: true,
          itemList: this.createDictList('2101')
        },
         {
          type: 'INPUT',
          label: '出资方',
          fieldName: 'majorCustomerName',
          disabled: true
        },
        {
          type: 'SELECT',
          label: '运输方式',
          fieldName: 'transportType',
          placeholder: '请选择',
          disabled: true,
          itemList: this.createDictList('2409')
        },
        {
          type: 'SELECT',
          label: '收车地址',
          fieldName: 'addressId',
          placeholder: '请选择',
          disabled: true,
          itemList: []
        },
        {
          type: 'INPUT',
          label: '送达城市',
          fieldName: 'deliveryCityName',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '联系人',
          fieldName: 'linkMan',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '联系电话',
          fieldName: 'linkPhone',
          disabled: true
        },
         {
          type: 'INPUT_NUMBER',
          precision: 2,
          initialValue: 0.0,
          label: '资金总余额',
          fieldName: 'totalAmount',
          disabled: true
        },
        {
          type: 'INPUT_NUMBER',
          precision: 2,
          initialValue: 0.0,
          label: '返利池可用余额',
          fieldName: 'rebateAmount',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '创建人',
          fieldName: 'createdName',
          disabled: true
        },
         {
          type: 'DATE',
          label: '创建时间',
          fieldName: 'createdAt',
          disabled: true,
          dateType: 'datetime'
        },
        
        {
          type: 'BREAK_SPACE',
          label: '车辆信息'
        }
      ];
    },
    createdTable() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '物料编号',
          dataIndex: 'productCode',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '物料描述',
          dataIndex: 'productName',
          align: 'center',
          width: 400,
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '数量',
          dataIndex: 'orderNum',
          sorter: true,
          filter: true,
          filterType: 'input',
          editable: true,
          editType: 'number',
          width: 100,
          editRequired: true,
          disabled: true
        },
        {
          title: '车辆用途',
          dataIndex: 'vehicleUse',
          sorter: true,
          filter: true,
          filterType: 'input',
          render: props => {
            return <span>{this.createDictText(props.row.vehicleUse, '2416')}</span>;
          }
        },
        {
          title: '资金类型',
          dataIndex: 'accountId',
          sorter: true,
          filter: true,
          filterType: 'input',
          disabled: true,
          render: p => {
            return (
            <el-select size="mini" 
            v-model={p.row.accountId} 
            required placeholder="请选择"
            disabled
            onChange={value => {p.row.accountId = value;}}>
            {p.row.accountTypeList.map(item => (
              <el-option key={item.accountId} label={item.accountTypeName} value={item.accountId} />
              ))}
            </el-select>
            );
            }
        },
        {
          title: '市场指导价',
          dataIndex: 'singleAmount',
          sorter: true,
          filter: true,
          precision: 2,
          filterType: 'input'
        },
        {
          title: '车系名称',
          dataIndex: 'seriesName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '车型名称',
          dataIndex: 'modelName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
         {
          title: '配置',
          dataIndex: 'configName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '选装',
          dataIndex: 'optionName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '内饰',
          dataIndex: 'trimColorName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '外饰',
          dataIndex: 'colorName',
          sorter: true,
          filter: true,
          filterType: 'input'
        }
      ];
    },
    createdTable1(){
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,fixed: 'left',
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '单据执行前状态',
          dataIndex: 'beforeOrderStatus',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList('2417'),
          render: p => {
            return <span>{this.createDictText(p.row.beforeOrderStatus,'2417')}</span>;
          }
        },
        {
          title: '单据执行后状态',
          dataIndex: 'afterOrderStatus',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList('2417'),
          render: p => {
            return <span>{this.createDictText(p.row.afterOrderStatus, '2417')}</span>;
          }
        },
        {
          title: '操作人员',
          dataIndex: 'createdBy',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '操作时间',
          dataIndex: 'createdAt',
          sorter: true,
          filter: true,
          filterType: 'date-range',
          dateFormat: 'yyyy-MM-dd HH:mm:ss'
        },
        {
          title: '操作类型',
          dataIndex: 'operationType',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '审批意见',
          dataIndex: 'auditOpinion',
          sorter: true,
          filter: true,
          filterType: 'input',
        },
      ]
    },
    async init() {
      console.log('传入数据',this.rowData);
      let res = await getDetail({ orderId: this.rowData.orderId });
      let res2 = await getLog({ orderId: this.rowData.orderId });
      
      if (res.resultCode == 200) {
          for (let i in this.rowData) {
            this.formList.map((x) => {
              if (x.fieldName == i) {
                x.initialValue = this.rowData[i];
              }
            });
          }
        this.tableList1 = res2.data;
        this.changeDealerAddress(this.rowData.addressId);
        this.tableList = res.data.detailDTOList;
        this.tableList.map(car => {
          //资金类型   
          car.accountTypeList = this.accountTypeList;
        });
        console.log('表格数据',this.tableList);
      }
    },
    //数字处理
    changeValueNum(a) {
      if (!a || a == null || isNaN(a)) {
        return 0;
      } else {
        return a;
      }
    },
    changeHandle(val) {
      this.saveData = val;
    },
    //获取经销商收车地址
    async getDealerAddress() {
      let res = await getDealerAddress();
      this.dealerAddress = res.data;
      this.dealerAddressItemList =this.dealerAddress.map(x => (
        {
          text: `${x.address}${x.addressProperty == 60351001 ? '(主店)' : ''}`,
          value: x.addressId,
          addressProperty: x.addressProperty
        }
      ));
      console.log( this.dealerAddressItemList,'收车地址');
      this.formList.find(x => x.fieldName == 'addressId').itemList = this.dealerAddressItemList;
    },
    changeDealerAddress(value) {
      for (let address of this.dealerAddress) {
        if(address.addressId == value) {
          this.formList[10].initialValue = address.cityName;
          this.formList[11].initialValue = address.linkMan;
          this.formList[12].initialValue = address.linkPhone;
          return;
        }
      }
    },
    //获取经销商可用资金总额和返利总额
    async getAmount() {
      let res = await getAmount();
      this.formList[13].initialValue = res.data.totalAmount;
      this.formList[14].initialValue = res.data.rebateAmount;
    },
    async getDealerAccountType() {
      let res = await getDealerAccountType();
      this.accountTypeList = res.data;
    },
    async closeDrawer() {
        //关闭
        this.$emit('close');
    },
    formatNumber(val) {
      return Number(val).toFixed(2);
    }
  }
};
</script>
<style lang="less">
.discount {
  text-decoration: underline;
  color: #d1291a;
  cursor: pointer;
}
</style>
